<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>表单验证1</title>
    <style>
        #d1{
            width:30%;
        margin:auto  ;
        }
        p{
            font-size: 13px;
            color:red;
        }
    </style>
</head>
<body>
    <form action="#" >
        <div id="d1">
                <table>
        <tr>
            <td>您的账号： </td>
            <td> <input type="text" id="username" name="username"><span style="color:red;">  *</span></td>
        </tr>
        <tr>
            <td> </td>
            <td> <p>只允许26个字母，不区分大小写，建议使用姓名拼音。</p></td>
        </tr>
        <tr>
            <td>邮件地址： </td>
            <td><input type="email" id="email" name="email"><span style="color:red;">  *</span> </td>
        </tr>
        <tr>
            <td> </td>
            <td> <p>用于接收货件确认通知等相关信息沟通。</p></td>
        </tr>
        <tr>
            <td>确认邮箱： </td>
            <td><input type="email" id="email" name="email"><span style="color:red;">  *</span> </td>
        </tr>
        <tr>
            <td> </td>
            <td> <p>请重新输入一遍您的邮箱地址。</p></td>
        </tr>
        <tr>
            <td>设置密码：</td>
            <td><input type="password" id="password" name="password"><span style="color:red;">  *</span></td>
        </tr>
        <tr>
            <td> </td>
            <td> <p>英文、符号或数字，最少6位字符。</p></td>
        </tr>
        <tr>
            <td>确认密码： </td>
            <td><input type="password" id="password" name="password"><span style="color:red;">  *</span> </td>
        </tr>
        <tr>
            <td> </td>
            <td> <p>请重新输入一遍您的设置密码。</p></td>
        </tr>
        <tr>
            <td> 联系电话：</td>
            <td><input type="text" id="phone" name="phone"><span style="color:red;">  *</span> </td>
        </tr>
        <tr>
            <td> </td>
            <td> <p>请输入正确电话号码，以保证我们能够联系到您。</p></td>
        </tr>
        <tr>
            <td>客服代码： </td>
            <td><input type="text" id="customer" name="customer" placeholder="mars"><span style="color:red;">  *</span> </td>
        </tr>
        <tr>
            <td> </td>
            <td> <p>如果您不知道客服代码，请在主页内咨询。</p></td>
        </tr>
        <tr>
            <td>验证码: </td>
            <td><input type="text" id="code" name="code" size="4" maxlength="4"><span style="color:red;">  *</span><img src="./image/验证码1.jpg" align="center">  </td>
        </tr>
        <tr>
            <td><hr style="border-top: 1px dashed #000;"> </td>
            <td>选填项(三选一) </td>
            <td><hr style="border-top: 1px dashed #000;"></td>
        </tr>
            <tr>
                <td>QQ： </td>
                <td><input type="text" id="qqid" name="qqid"> </td>
            </tr>
            <tr>
                <td>MSN： </td>
                <td><input type="text" id="msnid" name="msnid"> </td>
            </tr>
            <tr>
                <td> 旺旺：</td>
                <td> <input type="text" id="wwid" name="wwid"></td>
            </tr>
            <tr>
                <td>推荐人id： </td>
                <td><input type="text" id="recommendid" name="recommendid"></td>
            </tr>
            <tr>
                <td> </td>
                <td> <p>如果您是其他客户推荐，请填写该用户的账号</p></td>
            </tr>
            <tr>
                <td> </td>
                <td> <input type="checkbox" name="agreement" id="ch"><label for="ch"><a href="#" >已阅读相关会员服务协议</a></label>  </td>
            </tr>
            <br>
            <tr>
                <td> </td>
                <td><button type="submit" ><img src="./image/注册按钮1.jpg" </button></td>
            </tr>
        </table>
    </div>
    </form>
    
    
</body>
</html>